<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
  <title>非洲猪瘟与禽流感疫情检测系统</title>
  <link rel="stylesheet" href="../static/css/test.css">
  <script type="text/javascript" src="../static/js/jquery.js"></script>
  <script type="text/javascript" src="../static/js/calender.js"></script>
  <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=aC3t12bMaZIwBkiQ091subopgQtOeRjI"></script>
</head>
<body>
  <div class="all">
    <div class="headBar">
      <div class="left">
          <span id="day" style="font-size: 1.1vw;"></span>
          <span id="time" style="font-size: 1.8vw;"></span>
      </div>
      <div class="middle">
          <div class="mid_left">
            <div class="verLine1"></div>
            <div class="btn1">
              <button id="caseLeftbtn" class="caseLeftbtn" onclick="btn1(1)">ASFV</button><button id="caseRightbtn" class="caseRightbtn" onclick="btn1(2)">AIV</button>
            </div>
          </div>
          <div class="mid_mid">
            <div class="title">非洲猪瘟与禽流感疫情检测系统</div>
          </div>
          <div class="mid_right">
            <div class="btn2">
              <button id="nationLeftbtn" class="nationLeftbtn" onclick="btn2(1)">世界</button><button id="nationRightbtn" class="nationRightbtn"onclick="btn2(2)">中国</button>
            </div>
            <div class="verLine2"></div>
          </div>
          
      </div>
      <div class="right">
          <div class="dataFrom">数据来源：世界动物卫生组织(OIE)</div>
          <div class="tolTime">
            <span id="dataTime"></span>
          </div>    
      </div>
    </div>
    <div class="container">
      <div class="left_view">
        <div class="left1">
          <div class="data_title1">
              <div class="verLine3"></div>
              <div class="left_word1">
                <div class="text1"><span>当日新增报告(起)</span></div>
                <div class="add_time1"><span id="circle_time1"></span></div>
              </div>
              
          </div>
          <div class="up_circle">
            <div class="dot1">
              <div class="circle_word1">
                <div class="num1"><span>280</span></div>
                <div class="word1"><span>报告</span></div>
              </div>
            </div>
          </div>
        </div>
        <hr style="size: 0.3px;width: 100%;">
        <div class="left2">
          <div class="data_title2">
              <div class="verLine4"></div>
              <div class="left_word2">
                <div class="text2"><span>累计报告(起)</span></div>
                <div class="add_time2"><span id="circle_time2"></span></div>
              </div>
          </div>
          <div class="mid_circle">
            <div class="dot2">
              <div class="circle_word2">
                <div class="num2"><span>345</span></div>
                <div class="word2"><span>报告</span></div>
              </div>
            </div>
          </div>
        </div>
        <hr style="size: 0.3px;width: 100%;">
        <div class="left3">
          <div class="data_title3">
              <div class="verLine5"></div>
              <div class="left_word3">
                <div class="text3"><span>当日新增报告详情</span></div>
                <div class="add_time3"><span id="circle_time3"></span></div>
              </div>

          </div> 
          <div class="left_order_data">
            <div class="left_order_title">
                <div id="order_by"><span>排名</span></div>
                <div id="where"><span>发生地</span></div>
                <div id="sign_time"><span>报告时间</span></div>
                <div id="sign_all"><span>今日报告总数</span></div>
            </div>
            <div class="order_data">
                <ul id="order_num"></ul>
            </div>
          </div>
        </div>
      </div>
      <div class="middle_view">
        <div class="chart">
          <div class="center">
            <div class="calendar">
              <form name="date">
                  <select name="year" onchange="yearDate(this.value)">
                    <option value="">请选择</option>
                  </select>
                  <select name="month" onchange="monthDate(this.value)">
                    <option value="">请选择</option>
                  </select>
                  <select name="day">
                    <option value="">请选择</option>
                  </select>
                </form>
            </div>            
            <div id="map" style="width:100%;height: 552px;"></div>
          </div>
          <div class="down_mid_view">
            <div class="verLine7"></div>
            <div class="line_chart" id="echart2" style="width:100%;height: 268px;"></div>
            <div class="verLine8"></div>
          </div>
        </div> 
      </div>
      <div class="right_view">
        <div class="data_title4">
          <div class="verLine6"></div>
          <div class="right_word">
            <div class="text4"><span>积累报告数详情</span></div>
            <div class="add_time4"><span id="circle_time4"></span></div>
          </div>
        </div>
          <div class="right_order_data">
              <div class="right_order_title">
                  <div id="order_by2"><span>排名</span></div>
                  <div id="province"><span>省份</span></div>
                  <div id="sign_all2"><span>累计报告数</span></div>
              </div>
              <div class="right_all">
                  <ul id="listNum"></ul>
                  <ul id="listWord"></ul>     
                  <div id="echart3" style="width: 10vw;height: 732px;"></div>
              </div>
              
          </div>
      </div>
    </div>
  </div>
  <script language="javascript" src="../static/js/js.js"></script>
  <script type="text/javascript" src="../static/js/echarts.min.js"></script>
</body>

</html>